<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>用户中心管理</title>
    <link rel="stylesheet" href="static/css/semantic.min.css">


    <script src="static/js/vue.js"></script>
<!-- 引入样式 -->
<link rel="stylesheet" href="static/element-ui/lib-master/theme-chalk/index.css">
<!-- 引入组件库 -->
<script src="static/element-ui/lib-master/index.js">

</script>
  
</head>
<body>
	
		<div class="fillcontain" id="app">
<el-alert
title="用户管理页面"

type="success"

show-icon>
</el-alert>
<h2 class="ui teal header" style="text-align: center;margin-top: 10px;">欢迎来到农产品的用户中心管理</h2>

            <el-form
            :model="dataForm"
            class="search_container"
            label-width="100px"

            @keyup.enter.native="submit(1)"
          >
            <el-row>		
              <el-col :span="8">
                <el-form-item label="手机号码">
                  <el-input
                    v-model="dataForm.userMobile"
                    default-first-option
                   
                    allow-create
                    clearable
                    size="small"
                    placeholder="请输入你的手机号码...."
                    
                  >
                  
                  </el-input>
                </el-form-item>
              </el-col>
      
              <el-col :span="8">
                <el-form-item label="用户名称">
                  <el-input
                    v-model="dataForm.username"
                    placeholder="输入用户名称"
                    clearable
                    size="small"
                  ></el-input>
                </el-form-item>
              </el-col>

              
              <el-col :span="8">
                  <el-form-item label="用户状态">
                    <el-select
                      v-model="dataForm.islock"
                      clearable
                      size="small"
                    >
                  <el-option label="锁定"value="1"> </el-option>
                  <el-option label="未锁定"value="0"> </el-option>
                  
                  
                  </el-select>
                  </el-form-item>
                </el-col>
      
      
      
              <el-col :span="18">
                <el-form-item label="用户注册日期">
                  <el-date-picker
                  v-model="submistrdte"
                  type="date"
                  placeholder="开始日期"
                  value-format="yyyy-MM-dd"
                  clearable
                  size="small"
                >
                </el-date-picker>
                <span class="spanline">&nbsp;-&nbsp;</span>
                <el-date-picker
                  v-model="submienddte"
                  type="date"
                  placeholder="结束日期"
                  value-format="yyyy-MM-dd"
                 
                  clearable
                  size="small"
                >
                  </el-date-picker>
                </el-form-item>
              </el-col>
          
              
              <el-col :span="6" class="text_center">
                <el-button type="primary" icon="el-icon-search" @click="intDataList(1)" size="small" ></el-button>
                <el-button icon="el-icon-refresh" @click="resetForm" size="small"></el-button>
              </el-col>
            </el-row>
          </el-form>
          
      
          <!-- 查询结果列表 -->
          <div class="listbox">
          
            <!-- 列表 -->
            <el-table ref="multipleTable" 
            :data="dataList" border :fit="true" 
            style="width: 100%" disabled>
              <el-table-column sortable type="index" label="序号" header-align="center" width="70" ></el-table-column>
              <el-table-column v-if="false" sortable prop="userId" label="用户id" show-overflow-tooltip min-width="100" disabled>
                  <template slot-scope="scope"> 
                        

                    
                    <span > {{ scope.row.userId || '--' }} </span> 
                    </template>
                </el-table-column>
        
      
              <el-table-column sortable prop="username" label="用户名" show-overflow-tooltip min-width="100" disabled>
                <template slot-scope="scope"> 
                      

                  
                  <span > {{ scope.row.username || '--' }} </span> 
                  </template>
              </el-table-column>

              
              <el-table-column sortable prop="password" label="密码" show-overflow-tooltip min-width="100" disabled>
                  <template slot-scope="scope"> 
                        

                    
                    <span > {{ scope.row.password || '--' }} </span> 
                    </template>
                </el-table-column>
      
              <el-table-column sortable prop="nickname" label="昵称" show-overflow-tooltip min-width="100" >
                <template slot-scope="scope"> {{ scope.row.nickname || '--' }} </template>
              </el-table-column>
              <el-table-column prop="islock" label="用户锁定状态" show-overflow-tooltip min-width="100" sortable>
                  <template slot-scope="scope"> 
                      <el-button type="danger" size="small" v-if="scope.row.islock==1" @click="islock(scope.row)">锁定</el-button>
                      <el-button type="danger" size="small" v-if="scope.row.islock==0" @click="islock(scope.row)">未锁定</el-button>
                      <el-button type="danger" size="small" v-if="scope.row.islock==2">最高权限管理员</el-button>
                      <span v-else>{{ '--' }}</span>
                       </template>
                </el-table-column>
      
              <el-table-column prop="userMobile" label="手机" show-overflow-tooltip min-width="100" sortable>
                <template slot-scope="scope"> {{ scope.row.userMobile || '--' }} </template>
              </el-table-column>

              <el-table-column prop="userEmail" label="邮箱" show-overflow-tooltip min-width="100" sortable>
                <template slot-scope="scope"> {{ scope.row.userEmail || '--' }} </template>
              </el-table-column>
              <el-table-column prop="userImg" label="用户头像" show-overflow-tooltip min-width="110" sortable>
                <template slot-scope="scope">
              
                    
                  <span >{{ scope.row.userImg || '--' }}</span>
                  
                   </template>
              </el-table-column>
      
      
              <el-table-column prop="userRegtime" label="注册时间" show-overflow-tooltip min-width="100" sortable>
                <template slot-scope="scope"> {{ scope.row.userRegtime || '--' }} </template>
              </el-table-column>
      
          
              <el-table-column  prop="userModtime" label="更新时间" show-overflow-tooltip min-width="100" sortable>
                <template slot-scope="scope"> {{ scope.row.userModtime || '--' }} </template>
              </el-table-column>
      
          
              <el-table-column label="操作" show-overflow-tooltip min-width="180" fixed="right">
              
                  
                  <template slot-scope="scope">
                      <el-button
                       
                        type="text"
                        size="small"
                        @click="copyHandle(scope.row)"
                        >复制</el-button
                      >
                      <el-button
                      
                        type="text"
                        size="small"
                        @click="UpdateHandle(scope.row)"
                        >修改</el-button
                      >
                      <!-- <el-button
                        type="text"
                        size="small"
                        @click="saveHandle(scope.row, scope.$index, scope.row.id)"
                        v-if="!scope.row.disabled"
                        >保存</el-button
                      > -->
                      <el-button
                        type="text"
                        size="small"
                        @click="deleteHandle(scope.row.product_id, scope.$index)"
                        >删除</el-button
                      >
                    </template>
      
      
              
              
              </el-table-column>  <el-button type="danger"> 新增</el-button>
            </el-table>

<!-- 分页 -->
<el-row>
  <el-col :span="24">
    <div class="pagination">
      <!-- 分页 -->
      <el-pagination
        background
        @size-change="sizeChangeHandle"
        @current-change="currentChangeHandle"
        :current-page="page.pageIndex"
        :page-sizes="[10, 20, 50, 100]"
        :page-size="page.pageSize"
        :total="page.totalPage"
        layout="total, sizes, prev, pager, next, jumper"
      >
      </el-pagination>
    </div>
  </el-col>
</el-row>	


			
<el-dialog title="用户信息修改" :visible.sync="dialogFormVisible">
	<el-form :model="form">
	  <el-form-item label="用户名称" :label-width="formLabelWidth">
		<el-input v-model="form.username" autocomplete="off"></el-input>
	  </el-form-item>
	  <el-form-item label="用户状态" :label-width="formLabelWidth">
		<el-select v-model="form.islock" placeholder="请选择用户状态">
		  <el-option label="锁定" value="1"></el-option>
		  <el-option label="非锁定" value="0"></el-option>
		</el-select>
	  </el-form-item>


<!--  -->
<el-form-item label="手机号码" :label-width="formLabelWidth">
	<el-input v-model="form.userMobile" autocomplete="off" max-length="12">
	
	</el-input>
  </el-form-item>
  <el-form-item label="用户真实姓名" :label-width="formLabelWidth">
    <el-input
    type="textarea"
    :rows="2"
    placeholder="请输入内容"
    v-model="form.realname" autocomplete="off"></el-input>
    </el-form-item>

  <el-form-item label="用户昵称" :label-width="formLabelWidth">
	<el-input
	type="textarea"
  :rows="2"
  placeholder="请输入内容"
	v-model="form.nickname" autocomplete="off"></el-input>
  </el-form-item>



	</el-form>
	<div slot="footer" class="dialog-footer">
	  <el-button @click="dialogFormVisible = false">取 消</el-button>
	  <el-button type="primary" @click="updateProduct(form)" :disabled="confirm">确 定</el-button>
	</div>
  </el-dialog>

<!-- 商品信息的保存 -->

  <el-dialog title="用户信息增加" :visible.sync="dialogFormVisibleSave">
	<el-form :model="form">
	  <el-form-item label="用户名称" :label-width="formLabelWidth">
		<el-input v-model="form.product_name" autocomplete="off"></el-input>
	  </el-form-item>
	  <el-form-item label="商品分类名称" :label-width="formLabelWidth">
		<el-select v-model="form.category_id" placeholder="请选择活动区域">
		  <el-option label="区域一" value="shanghai"></el-option>
		  <el-option label="区域二" value="beijing"></el-option>
		</el-select>
	  </el-form-item>


<!--  -->
<el-form-item label="商品的状态" :label-width="formLabelWidth">
	<el-select v-model="form.isup" autocomplete="off">
		<el-option label="上架" value="1" style="color: teal;" checked></el-option>
		<el-option label="下架" value="0" style="color: red;"></el-option>

	</el-select>
  </el-form-item>
  <el-form-item label="商品说明" :label-width="formLabelWidth">
	<el-input
	type="textarea"
  :rows="2"
  placeholder="请输入内容"
	v-model="form.content" autocomplete="off"></el-input>
  </el-form-item>



	</el-form>
	<div slot="footer" class="dialog-footer">
	  <el-button @click="dialogFormVisibleSave = false">取 消</el-button>
	  <el-button type="primary" @click="dialogFormVisibleSave = false">保存</el-button>
	</div>
  </el-dialog>




          </div>
            </div>


            <script src="static/js/base.js"></script>
            <script src="static/js/axios.min.js"></script>
            <script src="static/js/cookie_utils.js"></script>

            
<script>
	new Vue({
      el:'#app',
	  data:{
        illcodeInputShow:true,
		
		formLabelWidth: '120px',
		dialogFormVisible:false,
		dialogFormVisibleSave:false,
		dataForm:{
			category_id:'',
			product_name:"",
      userMobile:"",
      islock:"",

		},
        form:{},
        confirm:false,
		dataList:[{},{}],
		sbusiorgMap:[{
			sorgname:'1',


		}],
		category_id:0,
		submistrdte:"",
		submienddte:"",
		disabled:true,
          page: {
        pageIndex: 1,
        pageSize: 5,
        totalPage: 0,
      },
      dataList:[],
     

      },
       methods:{
        islock(row){
          console.log(row.userId);

          this.$confirm(`确定进行锁定或者解除操作?`, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {

      axios({
		url:baseUrl+"user/islock",
		method:'post',
		data:row

	  }).then((res) => {
		  console.log(res.data);

		ELEMENT.Message.success(res.data.msg);
		this.intDataList();
        
        });
      });
            // ELEMENT.Message.success("恭喜解锁成功");

        },

      // 每页数
 sizeChangeHandle(val) {
      this.page.pageSize = val;
      this.page.pageIndex = 1;
      this.intDataList(2);
    },
    // 当前页
    currentChangeHandle(val) {
      this.page.pageIndex = val;
      this.intDataList(2);
    },

    //  前往末页
    toLastPage() {
      let max = Math.ceil(this.tablePage.totalResult / this.tablePage.pageSize);
      this.handleCurrentChange(max);
    },
		// 重置
		resetForm(){
			this.dataForm.islock="",
			this.dataForm.userMobile="",
			this.dataForm.username="",
	
			this.dataForm.regisTime="",
		this.intDataList(1);
			
		},



    // 支持enter键查询
    submit(val){
      // console.log(this.dataForm.branchname );
      this.intDataList(val);
    },

	  // 点击搜索按钮，请求数据
	  intDataList(val) {
      // this.$store.dispatch("loading/CHANGE_LOADING", true);
      let userId=getCookieValue("userId");
	  var params={
		  pageNum: this.page.pageIndex,
        pageSize: this.page.pageSize,	
        username:this.dataForm.username,
        islock:this.dataForm.islock,
        userMobile:this.dataForm.userMobile,
        userId:userId
		
	  }
      if (val === 1) {
      params={
		  pageNum: this.page.pageIndex,
        pageSize: this.page.pageSize,	
        username:this.dataForm.username,
        islock:this.dataForm.islock,
        userMobile:this.dataForm.userMobile,
        userId:userId
		
	  }
    
// 666
    
        sessionStorage.setItem("datumTasks",JSON.stringify(params))
      
      } 
	  let token=getCookieValue("token");
	  var url5=baseUrl+"user/queryBypage";
						
						axios({
								url:url5,
								method:"post",
								headers:{
									token:token
								},
								data:params
							}).then( res=>{

     
      
          this.dataList = [];
            console.log(res.data,"dataList-------------");
			this.dataList=res.data.data.list;
			// this.page.pageNum=1
			
			this.page.totalPage=res.data.data.total;
			this.pageIndex=res.data.data.pageNum;
         
      
          
            
              
             
         
        }).catch((err) => {
 
        
        }); 
      },



      
    // 修改功能
    UpdateHandle(row) {
      // 功能代码
	  this.category_id=row.category_id;
      row.disabled = false;
	  this.confirm=false;
	  this.form=row;
	  
      this.dialogFormVisible = true;
    },

    // 新增按钮
    addOrUpdateHandle() {
      //  功能代码
      this.dataList.push(this.commonData);
    },

  
    },
        created(){
  this.intDataList()
	  }
    })
</script>

</body>
</html>